import 'package:flutter/material.dart';

/// 控件执行动画
class AnimationApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Fade Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: FadeAppPage(title: 'Fade Demo'),
    );
  }
}

/// 渐变
class FadeAppPage extends StatefulWidget {
  // 标题
  final String title;

  FadeAppPage({Key key, this.title}) : super(key: key);

  @override
  State<StatefulWidget> createState() => _FadeAppPageState();
}

/// 渐变页
class _FadeAppPageState extends State<FadeAppPage>
    with TickerProviderStateMixin {
  // 动画控制器
  AnimationController controller;

  // 曲线动画
  CurvedAnimation curve;

  /// 初始化状态
  @override
  void initState() {
    super.initState();
    controller = AnimationController(
      duration: const Duration(milliseconds: 2000),
      // 必须实现with TickerProviderStateMixin
      vsync: this,
    );
    curve = CurvedAnimation(parent: controller, curve: Curves.easeIn);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Container(
          child: FadeTransition(
            opacity: curve,
            child: FlutterLogo(
              size: 100.0,
            ),
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton(
          tooltip: 'Fade',
          child: Icon(Icons.brush),
          onPressed: () {
            // 执行动画
            controller.forward();
          }),
    );
  }
}
